import React from 'react';
import ReactDOM from 'react-dom';

import { createHashHistory } from 'History';

import { Router, Route, useRouterHistory } from 'react-router';

import { syncHistoryWithStore, RouterStore } from 'mobx-react-router';

import { Provider } from 'mobx-react';

import Doc from 'weaDoc';
// import ComMobx from 'comsMobx';
const routing = new RouterStore();

const allStore = {
  routing,
  ...Doc.store,
  // ...ComMobx.store,
};
const {News} = Doc.com;

const browserHistory = useRouterHistory(createHashHistory)({
  queryKey: '_key',
  basename: '/',
});

const history = syncHistoryWithStore(browserHistory, allStore.routing);

const Home = props => props.children;

const Root = () => (
  <Provider {...allStore}>
    <Router history={history}>
      <Route name='main' breadcrumbName='入口' path='/main' component={Home}>
        {Doc.Route}
      </Route>
      <Route name="singleNews" path='news' component={News}></Route>
    </Router>
  </Provider>
);

ReactDOM.render(<Root />, document.getElementById('container'));
